import {isFunction} from '../../utils/utils'
import {observe} from '../../observe'

export function initState(vm) {
  const ops = vm.$options
  if (ops.data) {
    /*
     * data数据为什么是一个对象?
     * */
    initData(vm)
  }
}
function proxy(vm, source, key) {
  Object.defineProperty(vm, key, {
    get() {
      return vm[source][key]
    },
    set(newValue) {
      vm[source][key] = newValue
    }
  })
}
function initData(vm) {
  let data = vm.$options.data
  data = vm._data = isFunction(data) ? data.call(vm) : data
  observe(data)
  for (let key in data) {
    proxy(vm, `_data`, key)
  }
}
/*
 * 1.new Vue 会调用_init进行初始化操作
 * 2.会将用户的选项放到vm.$options上
 * 3.initState 去搜索选项上是否有data数据
 * 4.有就进行初始化initdata,判断数据是不是一个函数,获得data对象进行
 * 5.observe去观察对象中的数据(和vm沒有关系),data变成响应式
 * 6.vm上取值也能取到data上面的数据,是因为把data和vm做了关联 vm._data=data
 * 7.vm._data.xxx有点麻烦,想直接vm.xxx 所以对vm做了处理
 * 如有有el,将数据挂载到页面上*/
